<template>
  <div class="card">
    <slot name="header"></slot>
    <div style="margin-top: 20px">
      <div class="flex justify-between bcgConfig">
        <slot name="table-config"></slot>
      </div>
      <div class="bcg">
        <slot name="default"></slot>
        <slot name="footer"></slot>
      </div>
    </div>
  </div>
  <!-- </a-card> -->
</template>

<script lang="ts">
  import { defineComponent } from 'vue'
  export default defineComponent({
    name: 'TableBody',
  })
</script>

<style lang="less" scoped>
  .card {
    padding: 0;
    border-radius: 10px;
  }

  .bcgConfig {
    padding: 20px 20px 0 20px;
    border-radius: 10px 10px 0 0;
    background-color: var(--color-bg-1);
  }

  .bcg {
    padding: 20px;
    border-radius: 0 0 10px 10px;
    background-color: var(--color-bg-1);
  }
</style>
